view {
  box-sizing: border-box;
}
page {
  height: 100%;
  background: #f2f2f2;
}

.clearfix{clear: both;}
.fl{float: left;}
.fr{float: right;}

input.input_placeholder{color: #eee;}

.container {
  min-height: 100%;
  position: relative;
  background: #f2f2f2;
}
.swiper-top .wx-swiper-dots.wx-swiper-dots-horizontal{
     margin-bottom: 2rpx;
}
.swiper-top .wx-swiper-dot{
    width:18rpx;
    display: inline-flex;
    height: 18rpx;
    margin:0 5rpx;
    justify-content:space-between;
}
.swiper-top .wx-swiper-dot::before{
    content: '';
    flex-grow: 1;
    background:#fff;
    border-radius:30rpx
}
.swiper-top .wx-swiper-dot-active::before{
    background:#003399;
}
.footbar0{width: 100%; height: 100rpx; overflow: hidden; position:fixed; bottom:0rpx; z-index:10; background:#ffffff;  box-shadow: 0rpx -2rpx 2rpx #dddddd; display: flex;
    flex-wrap:nowrap;
    justify-content:center;
    align-content:stretch;}
.footbar0 navigator{width: 100%; height: 100rpx; text-align: center;}
.footbar0 button{width: 100%; height: 100rpx; text-align: center; border: 0; background:none;}
.footbar0 text{font-size: 30rpx; line-height: 30rpx; display: block; color: #999;}
.footbar0 .iconfont{display: block; font-size: 45rpx; line-height:50rpx; border: 0; margin: 8rpx 0 5rpx 0;}
.footbar0 .active text{color: #f60;}


.footbar{width: 101%; height: 100rpx; overflow: hidden; position:fixed; bottom:0rpx; z-index:10; background:#fff; box-shadow: 0rpx -2rpx 2rpx #dddddd;  display: flex; flex-direction: row; flex-wrap: nowrap; }
.footbar button{height: 100rpx; line-height: 100rpx; text-align: center; padding: 0; border: 0; border-radius: 0;}
.footbar  button.btn0_hover{background: #eee;}
.footbar .fbtn0{width: 20%; height:100rpx; line-height:40rpx; background: #fff; text-align: center;  overflow: hidden; position: relative; border-top:0rpx #eeeeee solid; border-left:2rpx #eeeeee solid; margin-left: -2rpx; }
.footbar .fbtn0 text{font-size: 30rpx; display: block; color: #666; margin:8rpx auto 0 auto;}
.footbar .fbtn0 .iconfont{display: block; font-size: 45rpx; line-height:45rpx; margin:8rpx auto 0 auto; border: 0;}
.footbar .fbtn0 text.orange{color: #f60;}
.footbar .fbtn1{width:40%; border-radius:0; border: 0; margin: 0; font-size: 35rpx; }
.footbar .fbtn1 .iconfont{font-size: 40rpx; margin-right: 10rpx;}
.footbar .fbtn100{width:100%; border-radius:0; border: 0; margin: 0; font-size: 35rpx; }

.footbar1{width: 100%; height: 100rpx; overflow: hidden; position:fixed; bottom:0; z-index:10; border-top:2rpx #eeeeee solid; padding: 0 40rpx; background:#fcfcfc; }
.footbar1 .finput{width:73%; height: 80rpx; color:#303030;  font-size: 30rpx; border-bottom:2rpx #ddd solid;}
.footbar1 .fbtn{width:25%; height:65rpx; line-height: 65rpx; background: #f60; color: #fff; border-radius:40rpx; margin-top: 20rpx;}

.footbar2{width: 100%; height: 100rpx; overflow: hidden; position:fixed; bottom:0; z-index:10; border-top:2rpx #eeeeee solid; background:#fcfcfc; }
.footbar2 .zan-stepper{float: left; margin: 20rpx 20rpx 0 30rpx;}
.footbar2 .price{font-size:30rpx; color: #999; margin: 20rpx 0 0 20rpx;}
.footbar2 .price text{font-size: 40rpx; color: #f60;}
.footbar2 .fbtn{height:100rpx; line-height:96rpx; background: #f60; color: #fff; font-size: 34rpx; border-radius: 0; padding: 0 50rpx;}


//uploadBox
.uploadBox{}
.uploadBox .upload_btn{width:200rpx; height:200rpx; float: left; text-align: center; background: #f3f3f3; border:0rpx #cccccc dotted; margin:0 16rpx 16rpx 0; }
.uploadBox .upload_btn .iconfont{font-size:80rpx; line-height:160rpx; display: block; margin:20rpx auto 0 auto; color: #999;}
.uploadBox .upload_img{width:200rpx; height:200rpx; float: left; margin:0 16rpx 16rpx 0; position: relative;}
.uploadBox .upload_img text{width: 40rpx; height: 40rpx; line-height: 40rpx; text-align: center; position: absolute; right:-10rpx; top:-10rpx; display: block; font-size:25rpx; border-radius: 100%; background: #f90; color: #fff; z-index: 10;}
.uploadBox .upload_img image{width:100%;height:200rpx;}

//zan-popup
.popup_close{position: absolute; right: 30rpx; top:30rpx; z-index: 10;}
.popup_close .iconfont{font-size: 40rpx; color: #ccc;}

//button
button.btn_red{background: #ac1f28; color: #fff; border: 0;}
button.btn_bred{border:1px #ac1f28 solid; color: #ac1f28;}
button.btn_blue{background: #039; color: #fff; border: 0;}
button.btn_bblue{border:1px #039 solid; color: #039;}
button.btn_orange{background: #f60; color: #fff; border: 0;}
button.btn_orange_hover{background: #f40;}
button.btn_yellow{background: #f90; color: #fff; border: 0;}
button.btn_borange{border:1px #f60 solid; color: #f60;}
button.btn_gray{background: #eee; color: #303030; border: 0;}
button.btn_gray_hover{background: #999; color: #303030;}
button.btn_bgray{border:1px #999999 solid; color: #303030;}
button.btn_black{background: #303030; color: #fff;}

//color
.gray{color: #999;}
.red{color: #f00;}
.blue{color:dodgerblue;}
.orange{color: #f60;}

//box_shadow
.box_shadow{border-radius: 10rpx; box-shadow: 2rpx 2rpx 5rpx #eeeeee;}
.Bbox{background: #fff; padding:20rpx 30rpx;}
.Bbox .box_tit{height: 70rpx; line-height:50rpx;  text-align: left; border-bottom: 2rpx #dddddd solid; margin-bottom: 15rpx;}
.Bbox .box_tit .more{font-size: 26rpx; color: #999;}
.Bbox .box_tit .tit{font-size: 34rpx; color: #039;}

.m20{margin-top:20rpx;}

checkbox-group{width: 100%;}
/*  重写 checkbox 样式  */
/* 未选中的 背景样式 */
checkbox .wx-checkbox-input{
   border-radius: 50%;/* 圆角 */
   width: 40rpx; /* 背景的宽 */
   height: 40rpx; /* 背景的高 */
}
/* 选中后的 背景样式 （红色背景 无边框 可根据UI需求自己修改） */
checkbox .wx-checkbox-input.wx-checkbox-input-checked{
    border-color: #ac1f28;
   background: #ac1f28;
}
/* 选中后的 对勾样式 （白色对勾 可根据UI需求自己修改） */
checkbox .wx-checkbox-input.wx-checkbox-input-checked::before{
   border-radius: 50%;/* 圆角 */
   width: 40rpx;/* 选中后对勾大小，不要超过背景的尺寸 */
   height: 40rpx;/* 选中后对勾大小，不要超过背景的尺寸 */
   line-height: 40rpx;
   text-align: center;
   font-size:30rpx; /* 对勾大小 30rpx */
   color:#fff; /* 对勾颜色 白色 */
   background: transparent;
   transform:translate(-50%, -50%) scale(1);
   -webkit-transform:translate(-50%, -50%) scale(1);
}

/*  重写 radio 样式  */
/* 未选中的 背景样式 */
radio .wx-radio-input{
   border-radius: 50%;/* 圆角 */
   width: 40rpx;
   height: 40rpx;
}
/* 选中后的 背景样式 （红色背景 无边框 可根据UI需求自己修改） */
radio .wx-radio-input.wx-radio-input-checked{
   background:#ac1f28;
}
/* 选中后的 对勾样式 （白色对勾 可根据UI需求自己修改） */
radio .wx-radio-input.wx-radio-input-checked::before{
   border-radius: 50%;/* 圆角 */
   width: 40rpx; /* 选中后对勾大小，不要超过背景的尺寸 */
   height: 40rpx; /* 选中后对勾大小，不要超过背景的尺寸 */
   line-height: 40rpx;
   text-align: center;
   font-size:30rpx; /* 对勾大小 30rpx */
   color:#fff; /* 对勾颜色 白色 */
   background: transparent;
   transform:translate(-50%, -50%) scale(1);
   -webkit-transform:translate(-50%, -50%) scale(1);
}

/*searchbar*/
.searchbar{width: 100%; height:auto; overflow: hidden; }
.searchbar .searchbar_menu{width: 100%; height: 80rpx; line-height: 80rpx; display: flex; background: #fff;position: fixed; top: 0; z-index:210; border-bottom: 1rpx #eeeeee solid; border-top: 1rpx #eeeeee solid; }
.searchbar .searchbar_menu button{width: 100%; border: 0; border-right: 1rpx #eeeeee solid; font-size: 30rpx; color: #666; border-radius: 0; position: relative;}
.searchbar .searchbar_menu button::after{
  position: absolute;
  top: 45%;
  left: 55%;
  margin-top:0px;
  margin-left:1rem;
  width: 0;
  height: 0;
  font-size: 0;
  line-height:0;
   border-left:20rpx solid transparent;  /* left arrow slant */
  border-right:20rpx solid transparent; /* right arrow slant */
  border-top:20rpx solid #ccc;
  content: ' ';
}
.searchbar .searchbar_menu button.active{color: #039;}
.searchbar .searchbar_menu button.active::after{ 
    margin-top: 0;
    width:0px;
    height:0px;
    border-left:20rpx solid transparent;
    border-right:20rpx solid transparent;
    border-top:0;
    border-bottom:20rpx solid #003399;
    font-size:0px;
    line-height:0px;
   }
.searchbar .searchbar_box{
    margin: 0; 
    background: none;
    position:fixed;
    top: -65%;
    width: 100%;
    height: 100%;
    z-index:201;
    visibility: hidden;
    -webkit-transition-duration: 0.4s;
}
.searchbar .searchbar_box.active{top:80rpx;visibility: visible;}
.searchbar .searchbar_box radio-group{position: absolute; width: 100%; top: 0; height:auto; overflow: hidden; background: #fff; z-index: 201;}
.searchbar .searchbar_box radio-group .zan-cell .zan-cell__bd{font-size: 30rpx; color: #666;}
.searchbar .searchbar_box .search_form{position: absolute; width: 100%; top: 0; height:auto; overflow: hidden; background: #fff; z-index: 201; padding: 40rpx 20rpx; text-align: center;}
.searchbar .searchbar_box .searchbar_bg{position:fixed; width: 100%; height: 100%; display: block; overflow:hidden; top:0; z-index: 80; background: rgba(0,0,0,0.3);}
.searchbar .searchbar_box .search_form input{width: 500rpx; height: 80rpx; line-height: 80rpx; font-size: 26rpx; border: 1rpx #dddddd solid; display: inline-block; border-radius: 10rpx; text-align: left;padding: 0 20rpx; font-size: 30rpx;}
.searchbar .searchbar_box .search_form button{width: 150rpx; height: 82rpx; line-height: 82rpx; overflow: hidden; background: #f60;  border: 0rpx #dddddd solid; display: inline-block; margin-left: 15rpx; }
.searchbar .searchbar_box .search_form button icon{margin-top: 20rpx;}


 .listbox{display: flex; padding: 20rpx 0;}
 .listbox .list_l{width:40%; height: auto; overflow: hidden;}
 .listbox .list_l image{width:100%; border-radius:8rpx;}
 .listbox .list_r{padding-left: 20rpx; text-align: left;}
 .listbox .list_r .tit{height:80rpx; overflow: hidden; font-size: 30rpx; line-height: 1.5; color: #333;}
 .listbox .list_r .info{font-size: 26rpx; color: #999; margin-top:40rpx;}
 .listbox .list_r .info .iconfont{font-size:30rpx; margin-right: 5rpx;}
 
 .listbox1{height: auto; overflow: hidden; padding: 20rpx 0;}
 .listbox1 .list_l{width:30%; height: auto; overflow: hidden;}
 .listbox1 .list_l image{width:100%; border-radius:8rpx;}
 .listbox1 .list_r{ height: auto; overflow: hidden; text-align: left;}
 .listbox1 .list_r .tit{ overflow: hidden; font-size: 30rpx; color: #333; margin-left: 25rpx;}
 .listbox1 .list_r .info{font-size: 26rpx; line-height:40rpx; color: #888; margin:10rpx 0 0 25rpx;}
 
 .listbox2{height: auto; overflow: hidden; padding: 20rpx 0; border-bottom: 1rpx #dddddd dashed;}
 .listbox2 .tit{ overflow: hidden; font-size: 34rpx; color: #333; margin-left: 25rpx;}
 .listbox2 .info{font-size: 26rpx; line-height:40rpx; color: #888; margin:10rpx 0 0 25rpx;}
 
 .listbox3{height: auto; overflow: hidden; padding:30rpx 0; border-bottom: 1rpx #dddddd solid;}
 .listbox3 .list_l{width:140rpx; height:140rpx; line-height:140rpx; height: auto; overflow: hidden; text-align: center; border-radius: 100%; background: #f90;}
 .listbox3 .list_l text{font-size: 50rpx; color: #fff;}
 .listbox3 .list_r{ height: auto; overflow: hidden; text-align: left;}
 .listbox3 .list_r .tit{ overflow: hidden; font-size: 30rpx; color: #333; margin-left: 25rpx;}
 .listbox3 .list_r .info{font-size: 26rpx; line-height:40rpx; color: #999; margin:10rpx 0 0 25rpx;}
 .listbox3 .list_r .status{float: right; font-size: 24rpx; padding:6rpx 10rpx; color: #fff; border-radius: 6rpx;}
 .listbox3.not .list_l{background: #f60;}
 .listbox3.not .list_r .status{background: #f60;}
 .listbox3.on .list_l{background: #039;}
 .listbox3.on .list_r .status{background: #039;}
 .listbox3.end .list_l{background:#999;}
 .listbox3.end .list_r .status{background: #999;}
 .listbox3 .list_r .time{font-size: 26rpx; line-height:40rpx; color: #999; margin:10rpx 0 0 25rpx;}
 
 .listbox4{width: 50%; height: auto; overflow: hidden; float: left; padding:20rpx 2%;}
 .listbox4 .imgbox{width: 100%; height:240rpx; overflow: hidden; position: relative;}
 .listbox4 .imgbox .ico_video{width: 80rpx; position: absolute; left: 40%; top:35%;}
 .listbox4 .imgbox image.img{width: 100%;  display: block;}
 .listbox4 .tit{height:80rpx; line-height:40rpx; overflow: hidden; font-size: 30rpx; margin-top: 10rpx; text-align: center;}
 
 .listbox5{height: auto; overflow: hidden; padding: 20rpx 30rpx; border-bottom: 0rpx #dddddd solid;}
 .listbox5 .list_l{width:30%; height: auto; overflow: hidden;}
 .listbox5 .list_l image{width:100%; border-radius:8rpx;}
 .listbox5 .list_r{ height: auto; overflow: hidden; text-align: left;}
 .listbox5 .list_r .tit{ overflow: hidden; font-size: 30rpx; color: #333; margin-left: 25rpx;}
 .listbox5 .list_r .price{font-size: 26rpx; line-height:40rpx; color: #888; margin:20rpx 0 0 25rpx;}
 .listbox5 .list_r .price text{font-size: 40rpx; color: #f60; margin-right: 10rpx;}
 .listbox5 .list_r .zan{float: right; font-size: 30rpx; color: #f90; margin-top:20rpx;}
 .listbox5 .list_r .txt{font-size: 26rpx; line-height:40rpx; color: #888; margin:20rpx 0 0 25rpx;}
 .listbox5 .list_r .num{float: right; font-size: 30rpx; color: #999; margin-top:18rpx;}
  .listbox5 .list_r .num .orange{font-size: 36rpx; color: #f60;}
 
 .comment_list{}
 .comment_list .c_box{padding: 20rpx 0; height: auto; overflow: hidden; border-bottom:1rpx #eeeeee dashed;}
 .comment_list .c_box .box_l{width: 12%; height: auto; overflow: hidden; margin-right: 20rpx;}
 .comment_list .c_box .box_l image{width: 100%; border-radius:100%;}
 .comment_list .c_box .box_r{text-align: left;}
 .comment_list .c_box .box_r .tit{font-size: 34rpx; color:#039;}
 .comment_list .c_box .box_r .time{font-size: 26rpx; color: #999; margin:10rpx 0;}
 .comment_list .c_box .box_r .con{font-size:30rpx; color: #666; line-height: 1.2; margin-top: 10rpx;}

